<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <meta name="author" content="纪德朝">
    <title>唯品会</title>
    <link rel="stylesheet" href="index.css">
</head>

<body>
    <nav style="z-index:9999">
        <div class="nav container">
            <div class="nav-left">
                <li class="current">
                    <div>
                        <a href="#" style="line-height:28px;">河南&#X3000;<span class="sanjiao"></span></a>
                    </div>
                    <ul class="active">
                        <i class="nav-Yc"></i>
                        <div>请选择收货地区</div>
                        <li>A<span>&#X3000;<a href="#">安徽</a>&#X3000;<a href="#">澳门</a></Aspan></li>
                    <li>B<span>&#X3000;<a href="#">北京</a></li>
                    <li>C<span>&#X3000;<a href="#">重庆</a></li>
                </ul>
                </li>
            </div>
            <ul class="nav-right">
                <li class="current">
                    <a href="#">请登录&#X3000;/</a>
                    <ul class="active denglu">
                        <i class="nav-Yc1"></i>
                        <div>您好！[请登录]</div>
                        <li><a href="#">我的收藏</a></li>
                        <li><a href="#">我的收藏</a></li>
                        <li><a href="#">我的收藏</a></li>
                        <li><a href="#">我的收藏</a></li>
                        <li><a href="#">我的收藏</a></li>
                        <li><a href="#">我的收藏</a></li>
                    </ul>
                </li>
                <li><a href="#">注册&#X3000;/</a></li>
                <li class="current qdyl">
                    <a href="#"><img src="./唯品会/header_sign.gif" alt="">签到有礼&#X3000;/</a>
                    <ul class="active xian">
                        <section id="first">
                            <p class="icon2"></p>
                            <span></span>
                            <div class="one">1天</div>
                            <spna class="xian1"></spna>
                            <span></span>
                            <div class="one1">2天</div>
                            <spna class="xian2"></spna>
                            <span></span>
                            <div class="one2">3天</div>
                            <spna class="xian3"></spna>
                            <span></span>
                            <div class="one3">4天</div>
                            <spna class="xian4"></spna>
                            <span></span>
                            <div class="one4">5天</div>
                            <spna class="xian5"></spna>
                            <span></span>
                            <div class="one5">6天</div>
                            <spna class="xian6"></spna>
                            <span></span>
                            <div class="one6">7天</div>
                            </section>
                            <section id="second">
                                <li><a href="#" style="text-decoration:underline;">每天签到送惊喜， 连续签到更享心动奖励</a></li>
                                <button>签到</button>
                            </section>
                    </ul>
                    </li>
                    <li><a href="#">我的订单&#X3000;/</a></li>
                    <li class="current">
                        <a href="#">我的特卖&#X3000;<span class="sanjiao1"></a>/
                        <ul class="active shoucang">
                            <i class="nav-Yc2"></i>
                            <li><a href="#">品牌收藏(0)</a></li>
                            <li><a href="#">商品收藏(0)</a></li>
                            <li><a href="#">我的足迹(0)</a></li>
                        </ul>
                    </li>
                    <li class="current huiyuan">
                        <a href="#">会员俱乐部&#X3000;<span class="sanjiao1"></span></a>/
                        <ul class="active shoucang">
                            <i class="nav-Yc2"></i>
                            <li><a href="#">俱乐部首页</a></li>
                            <li><a href="#">唯品币兑换</a></li>
                            <li><a href="#">免费抽大奖</a></li>
                        </ul>
                    </li>
                    <li class="current">
                        <a href="#">客户服务&#X3000;<span class="sanjiao1"></span>/</a>
                        <ul class="active kefu">
                            <i class="nav-Yc2"></i>
                            <li><a href="#">联系客服</a></li>
                            <li><a href="#">帮助中心</a></li>
                            <li><a href="#">服务中心</a></li>
                            <li><a href="#">知识产权投诉</a></li>
                        </ul>
                    </li>
                    <li class="icon1 current">
                        <a href="#">手机版&#X3000;/</a>
                        <ul class="active img">
                            <i class="nav-Yc3"></i>
                            <img src="./唯品会/4.jpg" alt="">
                            <p><a href="#">随时逛，随时抢</a></p>
                        </ul>
                    </li>
                    <li class="current">
                        <a href="#">更多<span class="sanjiao1"></span></a>
                        <ul class="active hezuo">
                            <ul>
                                <i class="nav-Yc4"></i>
                                <h3>合作专区</h3>
                                <a href="#">联名卡申请</a>
                                <a href="#">唯品卡</a>
                                <a href="#">支付专区</a>
                            </ul>
                            <ul>
                                <h3>关于我们</h3>
                                <a href="#">联名卡申请</a>
                                <a href="#">唯品卡</a>
                                <a href="#">支付专区</a>
                            </ul>
                        </ul>
                    </li>
                    </ul>
            </div>
    </nav>
    <header class="container header" style="z-index:1000">
        <div class="logo">
            <ul class="logo-left">
                <img src="./唯品会/12.png" alt="">
            </ul>
            <ul class="logo-right">
                <img src="./唯品会/1.png" alt="">
                <img src="./唯品会/2.png" alt="">
                <img src="./唯品会/3.png" alt="">
            </ul>
        </div>
        <div class="logo-gouwuche">
            <li class="current">
                <a href="#">我的购物袋</a>
                <ul class="active logo-denglu">
                    <i class="nav-Yc5"></i>
                    <li>好像还未登录！<a href="#">马上登录</a>查看购物袋</li>
                </ul>
            </li>

        </div>
    </header>
    <section class="middle">
        <div class="container">
            <div class="middle-top">
                <ul class="middle-top-left">
                    <li class="middle-top-left-first"><a href="#">首页</a></li>
                    <li><a href="#">唯品国际</a></li>
                    <li><a href="#">母婴</a></li>
                    <li><a href="#">家具家电</a></li>
                    <li><a href="#">男士</a></li>
                    <li><a href="#">美妆</a></li>
                    <li><a href="#">生活超市</a></li>
                    <li><a href="#">金融</a></li>
                    <li class="current">
                        <a href="#">更多<span class="gengduo"></span></a>
                        <ul class="active fenlei clearfix">
                            <li><a href="#"><img src="./唯品会/5.jpg" alt=""><div><p>女装</p></div></a></li>
                            <li><a href="#"><img src="./唯品会/6.jpg" alt=""><div><p>女装</p></div></a></li>
                            <li><a href="#"><img src="./唯品会/7.jpg" alt=""><div><p>女装</p></div></a></li>
                            <li><a href="#"><img src="./唯品会/8.jpg" alt=""><div><p>女装</p></div></a></li>
                            <li><a href="#"><img src="./唯品会/9.jpg" alt=""><div><p>女装</p></div></a></li>
                        </ul>
                    </li>
                </ul>
                <ul class="middle-top-right">
                    <li><img src="./唯品会/11.png" alt=""><a href="#">分类</a></li>
                    <li><img src="./唯品会/10.png" alt=""><a href="#">预告</a></li>
                </ul>
            </div>
        </div>
    </section>
    <main>
        <div class="main">
            <div class="main-img">
                <img src="./唯品会/16.jpg" alt="">
                <div class="container main-imgbottom">
                    <a href="#"></a><img src="./唯品会/lunbo01.jpg" alt="" class="main-xianshi">
                    <img src="./唯品会/lunbo02.jpg" alt="">
                    <img src="./唯品会/lunbo03.jpg" alt="">
                    <img src="./唯品会/lunbo04.jpg" alt="">
                    <ul class="main-img-bottom">
                        <li class="bottom-color"><a href="#">欧莱雅集团VIP大牌日</a></li>
                        <li><a href="#">时尚风暴最高满199减40</a></li>
                        <li><a href="#">居家夏末福利大派发</a></li>
                        <li><a href="#">全球早秋扫货指南</a></li>
                    </ul>
                    <ul class="anniu">
                        <li class="shang">&lt;</li>
                        <li class="next">&gt;</li>
                    </ul>
                </div>
            </div>

        </div>
    </main>
    <footer class="container">
        <div class="footer">
            <img src="./唯品会/17.jpg" alt="">
            <ul class="footer-img">
                <img src="./唯品会/13.jpg" alt=""><span id="first"></span>
                <img src="./唯品会/14.jpg" alt=""><span id="second"></span>
                <img src="./唯品会/15.jpg" alt=""><span id="last"></span>
            </ul>
            <img src="./唯品会/title_v2.jpg" alt="">
        </div>
    </footer>
    <div id="left-nav">
        <div class="left-nav1">
            <li class="left-nav-one current" style="margin-bottom:10px;">
                <a href="#"><span></span></a>
                <ul class="left-nav-right " style="color:black;text-align:center;">
                    <p>你好！请<a href="#">登录|注册</a></p>
                    <div class="dingdan" style="background-color:aliceblue;line-height:100px;">
                        <a href="#">我的订单</a>
                        <a href="#">我的消息</a>
                    </div>
                </ul>
            </li>
            <li class="left-nav-two" style="height:100px;">
                <a href="#">购物袋<span></span></a>
            </li>
            <li class="left-nav-three left-nav3">
                <a href="#"><span></span></a>
                <ul class="left-nav2">我的优惠券</ul>
            </li>
            <li class="left-nav-four left-nav3">
                <a href="#"><span></span></a>
                <ul class="left-nav2">我的品牌</ul>
            </li>
            <li class="left-nav-five left-nav3">
                <a href="#"><span></span></a>
                <ul class="left-nav2">我的商品</ul>
            </li>
            <li class="left-nav-six left-nav3">
                <a href="#"><span></span></a>
                <ul class="left-nav2">我的足迹</ul>
            </li>
        </div>
    </div>
    <section style="height:2000px;"></section>
</body>
<script src="./唯品会.js">

</script>

</html>